import 'bootstrap/dist/css/bootstrap.css'
import "./index.scss";
import { useContext } from 'react'
import { CountContext } from '../../utils/myContext'
function Count({goods_id,goods_count}) {
  const { changeCount } = useContext(CountContext)
  return (
    <div className="my-counter">
    <button
      disabled={goods_count === 0}
      type="button"
      onClick={()=>changeCount(goods_id,goods_count-1)}
      
      className="btn btn-light">
      -
    </button>
    <input
      type="input"
      className="form-control inp"
      value={goods_count}
      onChange={(e)=>{
        console.log(e.target.value)
        changeCount(goods_id,e.target.value)
      }}
    />
    <button
    disabled={goods_count === 10}
      type="button"
      onClick={()=>changeCount(goods_id,goods_count+1)}
      className="btn btn-light">
      +
    </button>
  </div>
  )
}

export default Count
